<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>超市收银系统</title>
    <link type="text/css" rel="stylesheet" href="fontsawesome/css/font-awesome.css"/>
    <link type="text/css" rel="stylesheet" href="css/style.css"/>
</head>
<style type="text/css">
    .providerAdd{
        line-height: 50px;
        width: 99%;
        border: 1px solid #e0f0fd;
        margin: 0 5px;
        background-color: rgba(32, 163, 255, 0.18);
    }
    #empForm {
        line-height: 50px;
        width: 50%;
        height: 70%;
        margin:0 auto;
        margin-bottom: 80px;

    }
    .add {
        width: 80%;
        line-height: 45px;
        margin: 20px 32%;
        font-size: 22px;
        font-weight: bold;
    }
    .add input {
        display: inline;
    }
    .add select {
        display: inline;
    }
    .providerAddBtn {
        margin-top: 20px;

    }
    .providerAdd input[type="button"]{
          width: 8%;
          font-size: 25px;
        background-color: rgba(10, 94, 182, 0.42);
      }
    .providerAdd input[value="保存"]{
        position:absolute;
        margin: 0;
          right:51%;
    }
    .providerAdd input[value="返回"]{
        position:absolute;
        margin: 0;
        right:41%;
    }
</style>
<body>
<!--用户-->
<div class="providerAdd">
    <form id="empForm">
        <div class="add first">
             <span>用户账号：</span>
            <input type="text" name="userName" id="userName" value="">
        </div>
        <div  class="add">

            <span>用户密码：</span>
            <input type="password" name="password" id="password" value="">

        </div>
        <div class="add">
            <span>用户姓名：</span>
            <input type="text" name="realName" id="realName" value="">
        </div>

        <div class="add">
            <span>确认密码：</span>
            <input type="password" id="ruserPassword" value="">
        </div>
        <div class="add">
            <span>用户性别：</span>
            <select name="sex" id="sex">
                <option value="2" selected="selected">男</option>
                <option value="1">女</option>
                <option value="0">保密</option>
            </select>
        </div>
        <div class="add">用户角色：
            <select class="role" name="roleId">
                <option>请选择角色</option>
                <option  th:each="list:${roleList}" th:value="${list.id}" th:text="${list.name }">s</option>
            </select>


        </div>
        <div class="add">
            <span>用户工资：</span>
            <input  type="text" name="salary" id="salary"  value="">
        </div>
        <div class="providerAddBtn">
            <input type="button" name="add" id="add" value="保存" >
            <input type="button" id="back" name="back" value="返回" >
        </div>
    </form>
</div>

</body>
<script src="/js/jquery-2.2.1.min.js"></script>
<script src="/js/jump.js"></script>
<script type="text/javascript">

    $(".providerAddBtn :button[value='保存']").bind("click", function() {
        /* 表单验证 */
        alert($("#empForm").serialize())
        /* 确认提示 */
        if(!confirm("确定保存新用户信息吗?")) return;
        location = "/emp/save?"+$("#empForm").serialize()
    });
    $(".providerAddBtn :button[value='返回']").bind("click", function() {
        location = "/emp/query?"
    });

</script>

</html>